<template>
  <ContentWrap>
    <el-form
      ref="formRef"
      :model="formData"
      :rules="formRules"
      label-width="160px"
      v-loading="formLoading"
    >
      <ContentWrap title="基础信息">
        <el-row>
          <el-col :span="12">
            <el-form-item label="车牌号" prop="vehicleNo">
              <el-input v-model="formData.vehicleNo" placeholder="请输入车牌号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="车牌颜色" prop="vehiclePlateColor">
              <el-select v-model="formData.vehiclePlateColor" placeholder="请输入车牌颜色">
                <el-option
                  v-for="dict in getStrDictOptions(DICT_TYPE.VEHICLE_COLOR)"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="车辆类别" prop="vehicleKind">
              <el-select
                style="width: 50%"
                v-model="formData.vehicleKind"
                placeholder="请输入车辆类别"
                @change="vehicleKindChange"
              >
                <el-option
                  v-for="dict in getStrDictOptions(DICT_TYPE.VEHICLE_KIND)"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
              <el-select
                style="width: 50%"
                v-model="formData.vehicleType"
                placeholder="请选择车辆类型"
              >
                <el-option
                  v-for="dict in getStrDictOptions(`${formData.vehicleKind}`)"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承运商" prop="carrierUscc">
              <el-select v-model="formData.carrierUscc" placeholder="请选择承运商" @change="carrierChange">
                <el-option
                  v-for="dict in carrierList"
                  :key="dict.carrierUscc"
                  :label="dict.carrierName"
                  :value="dict.carrierUscc"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </ContentWrap>
      <ContentWrap title="道路运输许可证信息">
        <el-row>
          <el-col :span="12">
            <el-form-item label="道路运输证号" prop="transportNo">
              <el-input v-model="formData.transportNo" placeholder="请输入道路运输证号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="核发机关" prop="approveOrg">
              <el-input v-model="formData.approveOrg" placeholder="请输入核发机关" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="道路运输证照" prop="transportFiles">
              <el-upload
                ref="uploadRef"
                list-type="picture-card"
                :auto-upload="false"
                :on-change="handleTransportChange"
                v-model:file-list="formData.transportFiles"
                :class="{ disabled: transportDisabled }"
              >
                <el-icon><UploadFilled /></el-icon>
                <template #file="{ file }">
                  <div>
                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleTransportRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
<!--              <el-button type="primary" plain style="margin-left: 20px" @click="transportFilesOcr">识别</el-button>-->
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="发证日期" prop="transportIssueDate">
              <el-date-picker
                v-model="formData.transportIssueDate"
                type="date"
                value-format="YYYY-MM-DD"
                placeholder="选择发证日期"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </ContentWrap>
      <ContentWrap title="行驶证信息">
        <el-row>
          <el-col :span="12">
            <el-form-item label="行驶证正面" prop="vehicleLicenseFrontFiles">
              <el-upload
                ref="uploadRef"
                list-type="picture-card"
                :auto-upload="false"
                :on-change="handleLicenseFrontChange"
                v-model:file-list="formData.vehicleLicenseFrontFiles"
                :class="{ disabled: licenseFrontDisabled }"
              >
                <el-icon><UploadFilled /></el-icon>
                <template #file="{ file }">
                  <div>
                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleLicenseFrontRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
<!--              <el-button type="primary" plain style="margin-left: 20px" @click="vehicleLicenseFrontFilesOcr">识别</el-button>-->
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="行驶证反面" prop="vehicleLicenseBackFiles">
              <el-upload
                ref="uploadRef"
                list-type="picture-card"
                :auto-upload="false"
                :on-change="handleLicenseBackChange"
                v-model:file-list="formData.vehicleLicenseBackFiles"
                :class="{ disabled: licenseBackDisabled }"
              >
                <el-icon><UploadFilled /></el-icon>
                <template #file="{ file }">
                  <div>
                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleLicenseBackRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
<!--              <el-button type="primary" plain style="margin-left: 20px" @click="vehicleLicenseBackFilesOcr">识别</el-button>-->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="所有人" prop="owner">
              <el-input v-model="formData.owner" placeholder="请输入所有人" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="档案编号" prop="archivesNo">
              <el-input v-model="formData.archivesNo" placeholder="请输入档案编号" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="车辆识别号VIN" prop="vin">
              <el-input v-model="formData.vin" placeholder="请输入车辆识别号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="核定人数" prop="approveNum">
              <el-input v-model="formData.approveNum" placeholder="请输入核定人数" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="发动机号" prop="engine">
              <el-input v-model="formData.engine" placeholder="请输入发动机号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="总重量(KG)" prop="totalWeight">
              <el-input v-model="formData.totalWeight" placeholder="请输入总重量" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="注册日期" prop="registerDate">
              <el-date-picker
                v-model="formData.registerDate"
                type="date"
                value-format="YYYY-MM-DD"
                placeholder="选择注册日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="整备重量(KG)" prop="curbWeight">
              <el-input v-model="formData.curbWeight" placeholder="请输入整备重量" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="发证日期" prop="issueDate">
              <el-date-picker
                v-model="formData.issueDate"
                type="date"
                value-format="YYYY-MM-DD"
                placeholder="选择发证日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="准牵引重量(KG)" prop="vehicleTonnage">
              <el-input v-model="formData.vehicleTonnage" placeholder="请输入准牵引重量" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="发证机关" prop="issueOrg">
              <el-input v-model="formData.issueOrg" placeholder="请输入发证机关" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="外阔尺寸(mm)" prop="vehicleLen">
              <el-row>
                <el-col :span="8">
                  <el-input v-model="formData.vehicleLen" placeholder="请输入车长">
                    <template #prepend>长</template>
                  </el-input>
                </el-col>
                <el-col :span="8">
                  <el-input v-model="formData.vehicleWidth" placeholder="请输入车宽">
                    <template #prepend>宽</template>
                  </el-input>
                </el-col>
                <el-col :span="8">
                  <el-input v-model="formData.vehicleHeight" placeholder="请输入车高">
                    <template #prepend>高</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="车辆照片" prop="vehicleFiles">
              <el-upload
                ref="uploadRef"
                list-type="picture-card"
                :auto-upload="false"
                :on-change="handleVehicleChange"
                v-model:file-list="formData.vehicleFiles"
                :class="{ disabled: vehicleDisabled }"
              >
                <el-icon><UploadFilled /></el-icon>
                <template #file="{ file }">
                  <div>
                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleVehicleRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="能源类型" prop="energyType">
              <el-select v-model="formData.energyType" placeholder="请选择能源类型">
                <el-option
                  v-for="dict in getIntDictOptions(DICT_TYPE.ENERGY_TYPE)"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="备注" prop="remark">
              <el-input v-model="formData.remark" placeholder="请输入备注" />
            </el-form-item>
          </el-col>
        </el-row>
      </ContentWrap>
      <el-form-item style="float: right">
        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
        <el-button @click="close">返 回</el-button>
      </el-form-item>
    </el-form>

    <!--    <el-dialog v-model="dialogVisible">-->
    <!--      <img w-full :src="dialogImageUrl" alt="" />-->
    <!--    </el-dialog>-->
    <el-image-viewer
      v-if="dialogVisible"
      @close="closeViewer"
      :url-list="[dialogImageUrl]"
    />
  </ContentWrap>
</template>
<script setup lang="ts">
import { DriverApi } from '@/api/base/driver'
import { VehicleApi } from '@/api/base/vehicle'
import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
import { Delete, ZoomIn, UploadFilled } from '@element-plus/icons-vue'
import { UploadFile } from 'element-plus'
import { CheckStatusEnum } from '@/utils/constants'
import { useTagsViewStore } from '@/store/modules/tagsView'
import { CarrierApi } from "@/api/base/carrier";

const { t } = useI18n() // 国际化
const { query } = useRoute() // 查询参数
const message = useMessage() // 消息弹窗
const { push, currentRoute } = useRouter() // 路由
const { delView } = useTagsViewStore() // 视图操作
const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
  id: undefined,
  carrierUscc: undefined,
  carrierName: undefined,
  vehicleNo: undefined,
  vehiclePlateColor: '2',
  vehicleKind: undefined,
  vehicleType: undefined,
  cooType: 1,
  transportNo: undefined,
  transportUrl: undefined,
  approveOrg: undefined,
  transportIssueDate: undefined,
  vehicleLicenseFrontUrl: undefined,
  vehicleLicenseBackUrl: undefined,
  owner: undefined,
  archivesNo: undefined,
  useNature: 0,
  approveNum: undefined,
  vin: undefined,
  engine: undefined,
  registerDate: undefined,
  issueDate: undefined,
  issueOrg: undefined,
  totalWeight: undefined,
  curbWeight: undefined,
  vehicleTonnage: undefined,
  vehicleLen: undefined,
  vehicleWidth: undefined,
  vehicleHeight: undefined,
  energyType: undefined,
  vehicleUrl: undefined,
  remark: undefined,
  status: undefined,
  authStatus: CheckStatusEnum.AUDIT.status,
  transportFiles: [],
  vehicleLicenseFrontFiles: [],
  vehicleLicenseBackFiles: [],
  vehicleFiles: []
})
const formRules = reactive({
  vehicleNo: [{ required: true, message: '车牌号不能为空', trigger: 'blur' }],
  vehicleKind: [{ required: true, message: '车辆类型不能为空', trigger: 'blur' }],
  vehiclePlateColor: [{ required: true, message: '车辆颜色不能为空', trigger: 'blur' }],
  cooType: [{ required: true, message: '合作类型不能为空', trigger: 'blur' }],
  transportNo: [{ required: true, message: '道路运输证号不能为空', trigger: 'blur' }],
  transportFiles: [{ required: true, message: '道路运输证照不能为空', trigger: 'blur' }],
  vehicleLicenseFrontFiles: [{ required: true, message: '行驶证正页不能为空', trigger: 'blur' }],
  vehicleLicenseBackFiles: [{ required: true, message: '行驶证副页不能为空', trigger: 'blur' }],
  owner: [{ required: true, message: '所有人不能为空', trigger: 'blur' }],
  useNature: [{ required: true, message: '使用性质不能为空', trigger: 'blur' }],
  vin: [{ required: true, message: '车辆识别号VIN不能为空', trigger: 'blur' }],
  registerDate: [{ required: true, message: '注册日期不能为空', trigger: 'blur' }],
  vehicleTonnage: [{ required: true, message: '准牵引/核定载质量不能为空', trigger: 'blur' }],
  issueDate: [{ required: true, message: '发证日期不能为空', trigger: 'blur' }],
  vehicleLen: [{ required: true, message: '外廓尺寸不能为空', trigger: 'blur' }],
  issueOrg: [{ required: true, message: '发证机关不能为空', trigger: 'blur' }],
  energyType: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }],
  vehicleFiles: [{ required: true, message: '车辆照片不能为空', trigger: 'blur' }],
  totalWeight: [{ required: true, message: '总重量不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref

/** 打开弹窗 */
const init = async () => {
  let id = query.id as unknown as number
  if (id == 'undefined') {
    id = undefined
  }
  formType.value = query.type
  resetForm()
  carrierList.value = await CarrierApi.getCarrierList({})
  if (id) {
    formLoading.value = true
    try {
      formData.value = await VehicleApi.getVehicle(id)
      if (formData.value.transportUrl && formData.value.transportUrl != '') {
        transportDisabled.value = true
        formData.value.transportFiles = [
          {
            url: formData.value.transportUrl
          }
        ]
      }
      if (formData.value.vehicleLicenseFrontUrl && formData.value.vehicleLicenseFrontUrl != '') {
        licenseFrontDisabled.value = true
        formData.value.vehicleLicenseFrontFiles = [
          {
            url: formData.value.vehicleLicenseFrontUrl
          }
        ]
      }
      if (formData.value.vehicleLicenseBackUrl && formData.value.vehicleLicenseBackUrl != '') {
        licenseBackDisabled.value = true
        formData.value.vehicleLicenseBackFiles = [
          {
            url: formData.value.vehicleLicenseBackUrl
          }
        ]
      }
      if (formData.value.vehicleUrl && formData.value.vehicleUrl != '') {
        vehicleDisabled.value = true
        formData.value.vehicleFiles = [
          {
            url: formData.value.vehicleUrl
          }
        ]
      }
    } finally {
      formLoading.value = false
    }
  }
}

/** 提交表单 */
const submitForm = async () => {
  // 校验表单
  if (!formRef) return
  const valid = await formRef.value.validate()
  if (!valid) return
  // 提交请求
  formLoading.value = true
  try {
    // const data = formData.value as unknown as BaseVehicleApi.BaseVehicleVO
    var paramsData = new FormData()
    if (formData.value.id != undefined) {
      paramsData.append('id', formData.value.id)
    }
    if (formData.value.carrierUscc != undefined) {
      paramsData.append('carrierUscc', formData.value.carrierUscc)
    }
    if (formData.value.carrierName != undefined) {
      paramsData.append('carrierName', formData.value.carrierName)
    }
    if (formData.value.vehicleNo != undefined) {
      paramsData.append('vehicleNo', formData.value.vehicleNo)
    }
    if (formData.value.vehiclePlateColor != undefined) {
      paramsData.append('vehiclePlateColor', formData.value.vehiclePlateColor)
    }
    if (formData.value.vehicleKind != undefined) {
      paramsData.append('vehicleKind', formData.value.vehicleKind)
    }
    if (formData.value.vehicleType != undefined) {
      paramsData.append('vehicleType', formData.value.vehicleType)
    }
    if (formData.value.cooType != undefined) {
      paramsData.append('cooType', formData.value.cooType)
    }
    if (formData.value.transportNo != undefined) {
      paramsData.append('transportNo', formData.value.transportNo)
    }
    if (formData.value.approveOrg != undefined) {
      paramsData.append('approveOrg', formData.value.approveOrg)
    }
    if (formData.value.transportIssueDate != undefined) {
      paramsData.append('transportIssueDate', formData.value.transportIssueDate)
    }
    if (formData.value.owner != undefined) {
      paramsData.append('owner', formData.value.owner)
    }
    if (formData.value.archivesNo != undefined) {
      paramsData.append('archivesNo', formData.value.archivesNo)
    }
    if (formData.value.useNature != undefined) {
      paramsData.append('useNature', formData.value.useNature)
    }
    if (formData.value.approveNum != undefined) {
      paramsData.append('approveNum', formData.value.approveNum)
    }
    if (formData.value.vin != undefined) {
      paramsData.append('vin', formData.value.vin)
    }
    if (formData.value.engine != undefined) {
      paramsData.append('engine', formData.value.engine)
    }
    if (formData.value.registerDate != undefined) {
      paramsData.append('registerDate', formData.value.registerDate)
    }
    if (formData.value.issueDate != undefined) {
      paramsData.append('issueDate', formData.value.issueDate)
    }
    if (formData.value.issueOrg != undefined) {
      paramsData.append('issueOrg', formData.value.issueOrg)
    }
    if (formData.value.totalWeight != undefined) {
      paramsData.append('totalWeight', formData.value.totalWeight)
    }
    if (formData.value.curbWeight != undefined) {
      paramsData.append('curbWeight', formData.value.curbWeight)
    }
    if (formData.value.vehicleTonnage != undefined) {
      paramsData.append('vehicleTonnage', formData.value.vehicleTonnage)
    }
    if (formData.value.vehicleLen != undefined) {
      paramsData.append('vehicleLen', formData.value.vehicleLen)
    }
    if (formData.value.vehicleWidth != undefined) {
      paramsData.append('vehicleWidth', formData.value.vehicleWidth)
    }
    if (formData.value.vehicleHeight != undefined) {
      paramsData.append('vehicleHeight', formData.value.vehicleHeight)
    }
    if (formData.value.energyType != undefined) {
      paramsData.append('energyType', formData.value.energyType)
    }
    if (formData.value.remark != undefined) {
      paramsData.append('remark', formData.value.remark)
    }
    if (formData.value.authStatus != undefined) {
      paramsData.append('authStatus', formData.value.authStatus)
    }
    if (
      typeof formData.value.transportFiles != 'undefined' &&
      typeof formData.value.transportFiles[0].raw != 'undefined'
    ) {
      paramsData.append('transportFile', formData.value.transportFiles[0].raw)
    }

    if (
      typeof formData.value.vehicleLicenseFrontFiles != 'undefined' &&
      typeof formData.value.vehicleLicenseFrontFiles[0].raw != 'undefined'
    ) {
      paramsData.append('vehicleLicenseFrontFile', formData.value.vehicleLicenseFrontFiles[0].raw)
    }

    if (
      typeof formData.value.vehicleLicenseBackFiles != 'undefined' &&
      typeof formData.value.vehicleLicenseBackFiles[0].raw != 'undefined'
    ) {
      paramsData.append('vehicleLicenseBackFile', formData.value.vehicleLicenseBackFiles[0].raw)
    }

    if (
      typeof formData.value.vehicleFiles != 'undefined' &&
      typeof formData.value.vehicleFiles[0].raw != 'undefined'
    ) {
      paramsData.append('vehicleFile', formData.value.vehicleFiles[0].raw)
    }

    if (formType.value === 'create') {
      await VehicleApi.createVehicle(paramsData)
      message.success(t('common.createSuccess'))
    } else {
      await VehicleApi.updateVehicle(paramsData)
      message.success(t('common.updateSuccess'))
    }
    dialogVisible.value = false
    close()
  } finally {
    formLoading.value = false
  }
}

/** 重置表单 */
const resetForm = () => {
  formData.value = {
    id: undefined,
    carrierUscc: undefined,
    carrierName: undefined,
    vehicleNo: undefined,
    vehiclePlateColor: '2',
    vehicleKind: undefined,
    vehicleType: undefined,
    cooType: 1,
    transportNo: undefined,
    transportUrl: undefined,
    approveOrg: undefined,
    transportIssueDate: undefined,
    vehicleLicenseFrontUrl: undefined,
    vehicleLicenseBackUrl: undefined,
    owner: undefined,
    archivesNo: undefined,
    useNature: undefined,
    approveNum: undefined,
    vin: undefined,
    engine: undefined,
    registerDate: undefined,
    issueDate: undefined,
    issueOrg: undefined,
    totalWeight: 0,
    curbWeight: 0,
    vehicleTonnage: 0,
    vehicleLen: undefined,
    vehicleWidth: undefined,
    vehicleHeight: undefined,
    energyType: undefined,
    vehicleUrl: undefined,
    remark: undefined,
    status: undefined,
    authStatus: CheckStatusEnum.AUDIT.status,
    transportFiles: [],
    vehicleLicenseFrontFiles: [],
    vehicleLicenseBackFiles: [],
    vehicleFiles: []
  }
  formRef.value?.resetFields()
}

const vehicleKindChange = () => {
  formData.value.vehicleType = undefined
}

//文件上传
const transportDisabled = ref(false)
const licenseFrontDisabled = ref(false)
const licenseBackDisabled = ref(false)
const vehicleDisabled = ref(false)
const disabled = ref(false)
const dialogImageUrl = ref('')

const handleTransportChange = (file: any, fileList: any) => {
  formData.value.transportFiles = fileList
  transportDisabled.value = fileList.length >= 1
}

const handleLicenseFrontChange = (file: any, fileList: any) => {
  formData.value.vehicleLicenseFrontFiles = fileList
  licenseFrontDisabled.value = fileList.length >= 1
}

const handleLicenseBackChange = (file: any, fileList: any) => {
  formData.value.vehicleLicenseBackFiles = fileList
  licenseBackDisabled.value = fileList.length >= 1
}

const handleVehicleChange = (file: any, fileList: any) => {
  formData.value.vehicleFiles = fileList
  vehicleDisabled.value = fileList.length >= 1
}

const handleTransportRemove = () => {
  transportDisabled.value = false
  formData.value.transportFiles = []
}

const handleLicenseFrontRemove = () => {
  licenseFrontDisabled.value = false
  formData.value.vehicleLicenseFrontFiles = []
}

const handleLicenseBackRemove = () => {
  licenseBackDisabled.value = false
  formData.value.vehicleLicenseBackFiles = []
}

const handleVehicleRemove = () => {
  vehicleDisabled.value = false
  formData.value.vehicleFiles = []
}

//共用
const handlePictureCardPreview = (file: UploadFile) => {
  dialogImageUrl.value = file.url
  dialogVisible.value = true
}

/** 关闭按钮 */
const close = () => {
  delView(unref(currentRoute))
  push('/base/base-vehicle')
}

const closeViewer = () => {
  dialogVisible.value = false
}

const carrierList = ref([])
const carrierChange = (carrierUscc: string) => {
  console.log(carrierUscc)
  const carrierData = carrierList.value.find((item) => {
    return item.carrierUscc == carrierUscc
  })
  console.log(carrierData.carrierName)
  formData.value.carrierUscc = carrierData.carrierUscc
  formData.value.carrierName = carrierData.carrierName
}

// const transportFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('transportFiles', formData.value.transportFiles[0].raw)
//   const idcard = await driverApi.cardOcr(paramsData)
//   formData.value.transportNo = idcard.license_number.replace(/[^\d]/g, "")
// }
//
// const vehicleLicenseFrontFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('vehicleLicenseFrontFiles', formData.value.vehicleLicenseFrontFiles[0].raw)
//   const idcard = await driverApi.cardOcr(paramsData)
//   console.log(idcard)
//   formData.value.vehicleNo = idcard.number
//   formData.value.owner = idcard.name
//   formData.value.vin = idcard.vin
//   // formData.value.approveNum =
//   formData.value.engine = idcard.engine_no
//   formData.value.registerDate = idcard.register_date
//   formData.value.issueDate = idcard.issue_date
//   formData.value.issueOrg = idcard.issuing_authority
// }
//
// const vehicleLicenseBackFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('vehicleLicenseBackFiles', formData.value.vehicleLicenseBackFiles[0].raw)
//   const idcard = await driverApi.cardOcr(paramsData)
//   console.log(idcard)
//   formData.value.archivesNo = idcard.file_no
//   if (idcard.register_date != null) {
//     console.log('not null')
//   } else {
//     console.log('null')
//   }
//   formData.value.approveNum = idcard.approved_passengers.replace('人', '')
//   if(idcard.unladen_mass != ''){
//     formData.value.curbWeight = idcard.unladen_mass.replace('kg', '')
//   }
//   if(idcard.traction_mass != ''){
//     formData.value.vehicleTonnage = idcard.traction_mass.replace('kg', '')
//   }
//   formData.value.totalWeight = accAdd(formData.value.curbWeight, formData.value.vehicleTonnage)
//   var dim = idcard.dimension.replace('mm', '')
//   var di = dim.split('×')
//   formData.value.vehicleLen = di[0]
//   formData.value.vehicleWidth = di[1]
//   formData.value.vehicleHeight = di[2]
//   console.log(getIntDictOptions(DICT_TYPE.ENERGY_TYPE))
//   var energyTypes = getIntDictOptions(DICT_TYPE.ENERGY_TYPE)
//   console.log(idcard.inspection_record)
//   var energyType = energyTypes.filter(item => idcard.inspection_record.indexOf(item.label) >= 0);
//   console.log(energyType)
//   console.log(energyType.value)
//   formData.value.energyType = energyType[0].value
// }

init()
</script>
<style rel="stylesheet/scss" lang="scss">
.disabled .el-upload--picture-card {
  display: none;
}
</style>
